<template>
  <div class="wrap">
    <h1>less 运算 operation </h1>
    <div class="area">less运算区域</div>
  </div>
</template>

<script>
export default {
  name: 'Operation',
  props: {

  }
}

/*
  less 运算 算数运算符 + - * / 可以对任何数字,颜色或者变量进行运算
*/
</script>


<style lang="less" scoped>
  @area-height: 100px;
  @border-color: orange;
  .area{
    width: 400px;
    height: @area-height + 200;
    border: 1px solid @border-color;
  } 
  
</style>
